<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="static/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="static/bootstrap/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="static/easyui/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/css/style.css" />
<script src="static/jquery/jquery-1.12.4.js"></script>
<script src="static/bootstrap/js/bootstrap.js"></script>
<script src="static/easyui/jquery.easyui.min.js"></script>
<script src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="static/excel/jquery.table2excel.js"></script>
<title>月报</title>
</head>

<body style="text-align: center;">

	<div style="margin-top: 5px;">
		项目：
		<input style="min-width: 200px; text-align: center;" id="projectitem" name="projectitem" class="easyui-combobox"
			editable="false"
			data-options="
						    valueField: 'id',
						    textField: 'name',
						    url: 'projectitemuserlist.do',
						    onLoadSuccess:function(data){
						    	if(data.length>0){
							    	$('#projectitem').combobox('setValue',data[0].id);
						    	}
						    },
						    onSelect: function(rec){
						    	projectitemid = rec.id;
						   		loadData();
						    },
						    panelHeight: 'auto'">
		月度：
		<input id="date" class="easyui-datebox" editable="false">
   		<a href="javascript:;" class="easyui-linkbutton" onclick="Export();">导出Excel</a>
	</div>
	<div class="container-fluid">
		<div class="row-fluid">
			<div class="span12">
				<table id="pro_table" class="table table-bordered" style="margin-top: 10px;">
					<thead>
						<th rowspan=2>类别</th>
						<th colspan=3>预算</th>
						<th colspan=3>申请</th>
						<th colspan=3>执行</th>
						<tr>
							<th>总计</th>
							<th>已审核</th>
							<th>未审核</th>
							<th>总计</th>
							<th>已审核</th>
							<th>未审核</th>
							<th>总计</th>
							<th>已审核</th>
							<th>未审核</th>
						</tr>

					</thead>
					<tbody id="table">
					</tbody>
				</table>
			</div>
		</div>
	</div>
</body>
<script th:inline="javascript">
	var projectitemid;
	var monthdate = "";
	var startdate = "";
	var enddate = "";

	function Export(){
		var projectitemname = $('#projectitem').combobox('getText');
		$("#pro_table").table2excel({
			excludes:".noExl",
			name : "月报-"+projectitemname,
			filename : "月报-"+projectitemname+"-"+formatDate(new Date())+".xls",
			bootstrap:false
		});
	}
	
	function loadData() {
		$.ajax({
			type : 'GET',
			url : "moneyinfo.do?projectitemid=" + projectitemid + "&monthdate=" + monthdate,
			contentType : "application/json",
			success : function(data) {
				var totalbudgetmoney = 0;
				var totalcapitalmoney = 0;
				var totalexecutemoney = 0;
				$('#table').find('tr').remove();
				$.each(data, function(i,val) {
					var row = '<tr>';
					row += '<td>' + val.content + '</td>';
					if (val.budgetmoney1 + val.budgetmoney2 > 0){
						row += '<td><b>' + (val.budgetmoney1 + val.budgetmoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.budgetmoney1 > 0){
						row += '<td><a class="d-btn btn-green" onclick="getbudget(this,' + val.id + ',\'4\'' + ')">'
								+ val.budgetmoney1.toFixed(2) + '</a></td>';
						totalbudgetmoney += Number(val.budgetmoney1);
					}else{
						row += '<td></td>';
					}
					if (val.budgetmoney2 > 0){
						row += '<td><a class="d-btn btn-yellow" onclick="getbudget(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.budgetmoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney1 + val.capitalmoney2 > 0){
						row += '<td><b>' + (val.capitalmoney1 + val.capitalmoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney1 > 0){
						row += '<td><a class="d-btn btn-green" onclick="getcapital(this,' + val.id + ',\'4\'' + ')">'
								+ val.capitalmoney1.toFixed(2) + '</a></td>';
						totalcapitalmoney += Number(val.capitalmoney1);
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney2 > 0){
						row += '<td><a class="d-btn btn-yellow" onclick="getcapital(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.capitalmoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					if (val.executemoney1 + val.executemoney2 > 0){
						row += '<td><b>' + (val.executemoney1 + val.executemoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.executemoney1 > 0){
						row += '<td><a class="d-btn btn-green" onclick="getexecute(this,' + val.id + ',\'4\'' + ')">'
								+ val.executemoney1.toFixed(2) + '</a></td>';
						totalexecutemoney += Number(val.executemoney1);
					}else{
						row += '<td></td>';
					}
					if (val.executemoney2 > 0){
						row += '<td><a class="d-btn btn-yellow" onclick="getexecute(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.executemoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					row += '</tr>';
					$('#table').append(row);
				});
				var html = '<tr><td colspan=4 ><h3>审批预算总额：' + totalbudgetmoney.toFixed(2) + ' ¥</h3></td>'
				html += '<td colspan=6 ><h3>实际开销总额：' + totalcapitalmoney.toFixed(2) + '+' + totalexecutemoney.toFixed(2) + '='
						+ (Number(totalcapitalmoney) + Number(totalexecutemoney)).toFixed(2) + ' ¥</h3></td></tr>';
				$('#table').append(html);
			},
			dataType : "json"
		});
	}
	
	$("#search").click(function(){
		startdate = $("#startdate").datebox('getValue');
		enddate = $("#enddate").datebox('getValue');
		$.ajax({
			type : 'GET',
			url : "moneyinfo2.do?projectitemid=" + projectitemid + "&startdate=" + startdate+"&enddate="+enddate,
			contentType : "application/json",
			success : function(data) {
				var totalbudgetmoney = 0;
				var totalcapitalmoney = 0;
				var totalexecutemoney = 0;
				$('#table').find('tr').remove();
				$.each(data, function(i,val) {
					var row = '<tr>';
					row += '<td>' + val.content + '</td>';
					if (val.budgetmoney1 + val.budgetmoney2 > 0){
						row += '<td><b>' + (val.budgetmoney1 + val.budgetmoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.budgetmoney1 > 0){
						row += '<td><a class="btn btn-success form-inline" onclick="getbudget(this,' + val.id + ',\'4\'' + ')">'
								+ val.budgetmoney1.toFixed(2) + '</a></td>';
						totalbudgetmoney += Number(val.budgetmoney1);
					}else{
						row += '<td></td>';
					}
					if (val.budgetmoney2 > 0){
						row += '<td><a class="btn btn-info form-inline" onclick="getbudget(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.budgetmoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney1 + val.capitalmoney2 > 0){
						row += '<td><b>' + (val.capitalmoney1 + val.capitalmoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney1 > 0){
						row += '<td><a class="btn btn-success form-inline" onclick="getcapital(this,' + val.id + ',\'4\'' + ')">'
								+ val.capitalmoney1.toFixed(2) + '</a></td>';
						totalcapitalmoney += Number(val.capitalmoney1);
					}else{
						row += '<td></td>';
					}
					if (val.capitalmoney2 > 0){
						row += '<td><a class="btn btn-info form-inline" onclick="getcapital(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.capitalmoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					if (val.executemoney1 + val.executemoney2 > 0){
						row += '<td><b>' + (val.executemoney1 + val.executemoney2).toFixed(2) + '</b></td>';
					}else{
						row += '<td></td>';
					}
					if (val.executemoney1 > 0){
						row += '<td><a class="btn btn-success form-inline" onclick="getexecute(this,' + val.id + ',\'4\'' + ')">'
								+ val.executemoney1.toFixed(2) + '</a></td>';
						totalexecutemoney += Number(val.executemoney1);
					}else{
						row += '<td></td>';
					}
					if (val.executemoney2 > 0){
						row += '<td><a class="btn btn-info form-inline" onclick="getexecute(this,' + val.id + ',\'6,7\'' + ')">'
								+ val.executemoney2.toFixed(2) + '</a></td>';
					}else{
						row += '<td></td>';
					}
					row += '</tr>';
					$('#table').append(row);
				});
				var html = '<tr><td colspan=4 ><h3>审批预算总额：' + totalbudgetmoney.toFixed(2) + ' ¥</h3></td>'
				html += '<td colspan=6 ><h3>实际开销总额：' + totalcapitalmoney.toFixed(2) + '+' + totalexecutemoney.toFixed(2) + '='
						+ (Number(totalcapitalmoney) + Number(totalexecutemoney)).toFixed(2) + ' ¥</h3></td></tr>';
				$('#table').append(html);
			},
			dataType : "json"
		});
	});
	
	function getbudget(obj,id,status) {
		$.ajax({
			type : 'GET',
			url : "getbudget.do",
			data : {
				projectitemid : projectitemid,
				itemid : id,
				status : status
			},
			contentType : "application/json",
			success : function(data) {
				var tr = "";
				$.each(data, function(i,val) {
					tr += '<tr><td>' + val.money + '</td>';
					tr += '<td>' + val.content + '</td>';
					if (val.reviewer1){
						tr += '<td>' + val.reviewer1.name + '</td>';
						tr += '<td>' + formatDate(val.level1reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					if (val.reviewer2){
						tr += '<td>' + val.reviewer2.name + '</td>';
						tr += '<td>' + formatDate(val.level2reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					tr += '</tr>';
				});
				$('#info').empty();
				$('#info').append(tr);
				$("#proDlg").modal('show');
			}
		});
	}
	function getcapital(obj,id,status) {
		$.ajax({
			type : 'GET',
			url : "getcapital.do",
			data : {
				projectitemid : projectitemid,
				itemid : id,
				status : status
			},
			contentType : "application/json",
			success : function(data) {
				var tr = "";
				$.each(data, function(i,val) {
					tr += '<tr><td>' + val.money + '</td>';
					tr += '<td>' + val.content + '</td>';
					if (val.reviewer1){
						tr += '<td>' + val.reviewer1.name + '</td>';
						tr += '<td>' + formatDate(val.level1reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					if (val.reviewer2){
						tr += '<td>' + val.reviewer2.name + '</td>';
						tr += '<td>' + formatDate(val.level2reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					tr += '</tr>';
				});
				$('#info').empty();
				$('#info').append(tr);
				$("#proDlg").modal('show');
			}
		});
	}
	function getexecute(obj,id,status) {
		$.ajax({
			type : 'GET',
			url : "getexecute.do",
			data : {
				projectitemid : projectitemid,
				itemid : id,
				status : status
			},
			contentType : "application/json",
			success : function(data) {
				var tr = "";
				$.each(data, function(i,val) {
					tr += '<tr><td>' + val.money + '</td>';
					tr += '<td>' + val.content + '</td>';
					if (val.reviewer1){
						tr += '<td>' + val.reviewer1.name + '</td>';
						tr += '<td>' + formatDate(val.level1reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					if (val.reviewer2){
						tr += '<td>' + val.reviewer2.name + '</td>';
						tr += '<td>' + formatDate(val.level2reviewdate) + '</td>';
					}else{
						tr += '<td></td>';
						tr += '<td></td>';
					}
					tr += '</tr>';
				});
				$('#info').empty();
				$('#info').append(tr);
				$("#proDlg").modal('show');
			}
		});
	}
	function formatDate(time) {
		var date = new Date(time);
		var year = date.getFullYear(),month = date.getMonth() + 1, //月份是从0开始的
		day = date.getDate(),hour = date.getHours(),min = date.getMinutes(),sec = date.getSeconds();
		var newTime = year + '-' + month + '-' + day;
		return newTime;
	}
	$(function() {
		$('#date').datebox({
			onShowPanel : function() {// 显示日趋选择对象后再触发弹出月份层的事件，初始化时没有生成月份层
				span.trigger('click'); // 触发click事件弹出月份层
				if (!tds)
					setTimeout(function() {// 延时触发获取月份对象，因为上面的事件触发和对象生成有时间间隔
						tds = p.find('div.calendar-menu-month-inner td');
						tds.click(function(e) {
							e.stopPropagation(); // 禁止冒泡执行easyui给月份绑定的事件
							var year = /\d{4}/.exec(span.html())[0]// 得到年份
							,month = parseInt($(this).attr('abbr'), 10) + 1; // 月份
							$('#date').datebox('hidePanel')// 隐藏日期对象
							.datebox('setValue', year + '-' + month); // 设置日期的值
							monthdate = year + "-" + month + "-01";
							loadData();
						});
					}, 0);
			},
			parser : function(s) {// 配置parser，返回选择的日期
				if (!s)
					return new Date();
				var arr = s.split('-');
				return new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, 1);
			},
			formatter : function(d) {
				if (d.getMonth() == 0){
					return d.getFullYear() - 1 + '-' + 12;
				}else{
					return d.getFullYear() + '-' + d.getMonth();
				}
			}// 配置formatter，只返回年月
		});
		var p = $('#date').datebox('panel'), // 日期选择对象
		tds = false, // 日期选择对象中月份
		span = p.find('span.calendar-text'); // 显示月份层的触发控件
	});
</script>
<style>
.table th, .table td {
	text-align: center;
	vertical-align: middle !important;
}

.modal-backdrop {
	z-index: 0;
}
</style>

</html>